<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="utf-8" />
    <title>个人信息</title>
    <link rel="stylesheet" type="text/css" href="css/public.css" />
    <link rel="stylesheet" type="text/css" href="css/mygrxx.css" />
</head>

<body>
    <!------------------------------head------------------------------>
    <div class="head">
        <div class="wrapper clearfix">
            <div class="clearfix" id="top">
                <h1 class="fl"><a href="index.html"></a></h1>
                <div class="fr clearfix" id="top1">
                    <p class="fl"><a href="#" id="login">登录</a><a href="#" id="reg">注册</a>
                    </p>
                    <form action="#" method="get" class="fl"><input type="text" placeholder="大学物理" /><input
                            type="button" /></form>
                    <div class="btn fl clearfix"><a href="mygxin.html"><img src="img/grzx.png" /></a><a href="#"
                            class="er1"><img src="img/ewm.png" /></a><a href="cart.html"><img src="img/gwc.png" /></a>
                        <p><a href="#"><img src="img/smewm.png" /></a></p>
                    </div>
                </div>
            </div>
            <ul class="clearfix" id="bott">
                <li><a href="index.html">首页</a></li>
                <li><a href="paint.html">大学通用</a>
                    <div class="sList">
                        <div class="wrapper  clearfix"><a href="paint.html">
                                <dl>
                                    <dt></dt>
                                    <dd>高数类</dd>
                                </dl>
                            </a><a href="paint.html">
                                <dl>
                                    <dt></dt>
                                    <dd>英语类</dd>
                                </dl>
                            </a><a href="paint.html">
                                <dl>
                                    <dt></dt>
                                    <dd>政治类</dd>
                                </dl>
                            </a><a href="paint.html">
                                <dl>
                                    <dt></dt>
                                    <dd>计算机类</dd>
                                </dl>
                            </a><a href="paint.html">
                                <dl>
                                    <dt></dt>
                                    <dd>经济类</dd>
                                </dl>
                            </a></div>
                    </div>
                </li>
                <li><a href="flowerDer.html">专业课书籍&nbsp;</a>
                    <div class="sList2">
                        <div class="clearfix"><a href="flowerDer.html">
                                <dl>
                                    <dt></dt>
                                    <dd>&nbsp;&nbsp;&nbsp;文科&nbsp;&nbsp;&nbsp;</dd>
                                </dl>
                            </a><a href="flowerDer.html">
                                <dl>
                                    <dt></dt>
                                    <dd>理工科</dd>
                                </dl>
                            </a></div>
                    </div>
                </li>
                <li><a href="decoration.html">其他书籍&nbsp;</a>

                </li>

                <li><a>&nbsp;</a></li>
                <li><a href="idea.html">国家类考试资料</a></li>
            </ul>
        </div>
    </div>
    <!------------------------------idea------------------------------>
    <div class="address mt">
        <div class="wrapper clearfix"><a href="index.html" class="fl">首页</a><span>/</span><a href="mygxin.html"
                class="on">个人信息</a>
        </div>
    </div>
    <!------------------------------Bott------------------------------>
    <div class="Bott">
        <div class="wrapper clearfix">
            <div class="zuo fl">
                <h3><a href="#"><img src="img/tx.png" /></a>
                    <p class="clearfix"><span class="fl">[<span id='user'></span>]</span><span class="fr">[退出登录]</span>
                    </p>
                </h3>
                <div>
                    <h4>我的交易</h4>
                    <ul>
                        <li><a href="cart.html">我的购物车</a></li>
                        <li><a href="myorderq.html">我的订单</a></li>
                        <li><a href="myprod.html">评价晒单</a></li>
                    </ul>
                    <h4>个人中心</h4>
                    <ul>
                        <li><a href="mygxin.html">我的中心</a></li>
                        <li><a href="address.html">地址管理</a></li>
                    </ul>
                    <h4>账户管理</h4>
                    <ul>
                        <li class="on"><a href="myg1rxx.html">个人信息</a></li>
                        <li><a href="remima.html">修改密码</a></li>
                    </ul>
                </div>
            </div>
            <div class="you fl">
                <h2>个人信息</h2>
                <div class="gxin">
                    <div class="tx"><a href="#"><img src="img/tx.png" />
                            <p id="avatar">修改头像</p>
                        </a></div>
                    <div class="xx">
                        <h3 class="clearfix"><strong class="fl">基础资料</strong><a href="#" class="fr" id="edit1">编辑</a>
                        </h3>
                        <div><span id='user'></span></div>
                        <div>生日：<span id='both'></span></div>
                        <div>性别：<span id='sex'></div>
                        <h3>高级设置</h3>
                        <!--<div><span class="fl">银行卡</span><a href="#" class="fr">管理</a></div>-->
                        <div><span class="fl">账号地区：<span id='area'></span></span><a href="#" class="fr"
                                id="edit2">修改</a></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--遮罩-->
    <div class="mask"></div>
    <!--编辑弹框-->
    <div class="bj">
        <div class="clearfix"><a href="#" class="fr gb"><img src="img/icon4.png" /></a></div>
        <h3>编辑基础资料</h3>
        <form action="#" method="get">
            <p><label>姓名：</label><input id='user2' type="text" value="六六六" /></p>
            <p><label>生日：</label><input id='both2' type="text" /></p>
            <p><label>性别：</label> <select name="" id="sex2">
                    <option value="1">男</option>
                    <option value="2">女</option>
                </select> </p>
            <div class="bc"><input type="button" id="btn2" value="保存" /><input type="button" value="取消" /></div>
        </form>
    </div>
    <!--高级设置修改-->
    <div class="xg">
        <div class="clearfix"><a href="#" class="fr gb"><img src="img/icon4.png" /></a></div>
        <h3>切换账号地区</h3>
        <form action="#" method="get">
            <p><label>姓名：</label><input type="text" value="六六六" /></p>
            <div class="bc"><input type="button" value="保存" /><input type="button" value="取消" /></div>
        </form>
    </div>
    <!--修改头像-->
    <div class="avatar">
        <div class="clearfix"><a href="#" class="fr gb"><img src="img/icon4.png" /></a></div>
        <h3>修改头像</h3>
        <form action="#" method="get">
            <h4>请上传图片</h4><input type="button" value="上传头像" />
            <p>jpg或png，大小不超过2M</p><input type="submit" value="提交" />
        </form>
    </div>
    <!--返回顶部-->
    <div class="gotop"><a href="cart.html">
            <dl>
                <dt><img src="img/gt1.png" /></dt>
                <dd>去购<br />物车</dd>
            </dl>
        </a><a href="#" class="dh">
            <dl>
                <dt><img src="img/gt2.png" /></dt>
                <dd>联系<br />客服</dd>
            </dl>
        </a><a href="mygxin.html">
            <dl>
                <dt><img src="img/gt3.png" /></dt>
                <dd>个人<br />中心</dd>
            </dl>
        </a><a href="#" class="toptop" style="display: none">
            <dl>
                <dt><img src="img/gt4.png" /></dt>
                <dd>返回<br />顶部</dd>
            </dl>
        </a>
        <p>400-800-8200</p>
    </div>
    <!--footer-->
    <div class="footer">
        <div class="top">
            <div class="wrapper">
                <div class="clearfix"><a href="#2" class="fl"><img src="img/foot1.png" /></a><span
                        class="fl">7天无理由退货</span>
                </div>
                <div class="clearfix"><a href="#2" class="fl"><img src="img/foot2.png" /></a><span
                        class="fl">15天免费换货</span>
                </div>
                <div class="clearfix"><a href="#2" class="fl"><img src="img/foot3.png" /></a><span
                        class="fl">满59包邮</span>
                </div>
                <div class="clearfix"><a href="#2" class="fl"><img src="img/foot4.png" /></a><span
                        class="fl">特色服务</span>
                </div>
            </div>
        </div>
        <p class="dibu">二手书店</p>
    </div>
    <script src="js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/public.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/user.js" type="text/javascript" charset="utf-8"></script>
</body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script>
    var baseUrl = "http://127.0.0.1";
    var id = localStorage.id
    $(function () {

        $.get(`${baseUrl}/findUserById/${id}`, function (data) {
            if (data.result == 1) {
                $("#user").html(data.name)
                $("#both").html(data.birthday)
                var sex = data.sex == 1 ? "男" : "女"
                $("#sex").html(sex)
                $("#area").html(data.area)
            }
        });
    })

    $("#btn2").on("click", function () {
        var data = {
            name: $("#user2").val(),
            birthday: $("#both2").val(),
            sex: $("#sex2").val(),
        }
        console.log(data)
        $.post(`${baseUrl}/updateUserById/${id}`, JSON.stringify(data), function (data) {
            if (data.result == 1) {
                alert("修改成功");
            } else {

                return;
            }
        });
    });
</script>

</html>